<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
  <head>
    <link rel="stylesheet" type="text/css" href="../../easyui/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="../../easyui/themes/icon.css">
	<!--引入Jquery主文件-->
	<script type="text/javascript" src="../../easyui/jquery.min.js"></script>
	<!--引入JqueryEasyUI主文件-->
	<script type="text/javascript" src="../../easyui/jquery.easyui.min.js"></script>
	<!--让easyUI支持中文-->
	<script type="text/javascript" src="../../easyui/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">

var url;
/* 添加教室信息的函数 */
function addClassroom(){
  	 $("#classroom_add").dialog({closed:false,title:"添加教室信息"});
	 url="${pageContext.request.contextPath}/pages/classroom/add.do";
	}

//编辑教室信息
	function editClassroom(){
	//若未选择要修改的记录，给出提示
	 
	 var selected = $("#classroom_datagrid").datagrid("getSelections");
	 if(selected.length == 0){
		$.messager.alert("消息提示", "请选择要编辑记录", "error");
	 }
	 //若已经选择了需要修改的记录，那么进行修改操作
	 var row=$("#classroom_datagrid").datagrid("getSelected");
	 if(row){
		  $("#classroom_edit").dialog({closed:false,title:"编辑教室信息"});
		  $("#classroomfm_edit").form("load",row);
		 url="${pageContext.request.contextPath}/pages/classroom/update.do";
	 } 
}

	function saveClassroomAdd(){
  	$('#classroomfm_add').form('submit', {  		
  		url:url,   
	    onSubmit: function(){  
		  //表单验证  
	    },    
	    success:function(data){    
	       var data=eval("("+data+")");
		   if(data.res){	
		   	  $('#classroom_add').dialog({closed:true});
			  $("#classroom_datagrid").datagrid("reload");
		   }else{
			   alert("保存失败！");
		   }  
	    }    
	}); 
  }
	
	function saveClassroomEdit(){
  	$('#classroomfm_edit').form('submit', {  		
  		url:url,   
	    onSubmit: function(){  
		  //表单验证  
	    },    
	    success:function(data){    
	       var data=eval("("+data+")");
		   if(data.res){	
		   	  $('#classroom_edit').dialog({closed:true});
			  $("#classroom_datagrid").datagrid("reload");
		   }else{
			   alert("保存失败！");
		   }  
	    }    
	}); 
  } 

function delClassroom(){
  	//若未选择要删除的记录，给出提示
  	 var selected = $("#classroom_datagrid").datagrid("getSelections");
	  	 if(selected.length == 0){
	  		$.messager.alert("消息提示", "请选择要删除的记录", "error");
	  	 }
  	 var row=$("#classroom_datagrid").datagrid("getSelected");
	 if(row){
	 	$.messager.confirm('确认','您确认想要删除记录吗？',function(r){    
	    if (r){    
	        $.post('${pageContext.request.contextPath}/pages/classroom/delete.do',{id:row.id},function(data){
				if(data.res)
				{
					$("#classroom_datagrid").datagrid("reload");
				}else{
					alert("删除失败！")
				}
				
			},"json");    
	    }    
	}); 
	 }
  }
//取消选中的记录
function unselect() {
$("#classroom_datagrid").datagrid("clearSelections");
$("#classroom_datagrid").datagrid("unselectAll");
}
</script>


  </head>
 <body>   
 
	<table class="easyui-datagrid" id="classroom_datagrid" style="width:700px;height:250px"
            data-options="singleSelect:true,
				            fit:true,fitColumns:true,
				            pagination:true,
				            collapsible:true,
				            pagePosition : 'bottom',

							pageList : [ 5,10,15,20 ],
							pageSize : 5,
							checkOnSelect : true,
							selectOnCheck : true,
							toolbar:'#tb',
				            url:'${pageContext.request.contextPath}/pages/classroom/query.do',method:'post'">
        <thead>
            <tr>
                <th data-options="field:'id',width:100,align:'center',checkbox:true">id</th>
                <th data-options="field:'name',width:80,align:'center'">教室名</th>
                <th data-options="field:'address',width:80,align:'center'">所在地址</th>
                <th data-options="field:'capacity',width:80,align:'center'">座位数</th>
            </tr>
        </thead>
    </table>
    
    <!--  对教室信息进行增删改查的操作的按钮 -->
	    <div id="tb">
		   	 <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add'" onclick="addClassroom()"> 新建</a>
			 <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit'" onclick="editClassroom()"> 编辑</a>
			 <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" onclick="delClassroom()"> 删除</a>
			 <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-undo'" onclick="unselect()"> 取消选中</a>
	   	</div>
	   	
	    <!-- 对教室进行增加的表单 -->
	   	<div id="classroom_add" class="easyui-dialog" style="width:300px;height:230px;background:gray" data-options="buttons:'#btnsadd',closed:true">
	   	   <form id="classroomfm_add" method="post">
	   	   	 <!-- <center>教室信息</center> -->
	   	   	 <br/>
			    教室名称:<input type="text" name="name"/><br/><br/>
			   所在地址:<input type="text" name="address"/><br/><br/>
			   座 位 数:<input type="text" name="capacity"/><br/>
	   	   </form>
   		</div>
   			   <!-- 	对教室进行修改的表单 -->
	   	<div id="classroom_edit" class="easyui-dialog" style="width:300px;height:230px;background:gray" data-options="buttons:'#btnsedit',closed:true">
	   	   <form id="classroomfm_edit" method="post">
	   	   	 <br/>
	   	   	 <input type="text" name="id" hidden=true/><br/>
			    教室名称:<input type="text" name="name"/><br/><br/>
			   所在地址:<input type="text" name="address"/><br/><br/>
			   座 位 数:<input type="text" name="capacity"/><br/>
	   	   </form>
   		</div>
   		<!-- 定义添加表单上的按钮 -->
   		<div id="btnsadd">
		   	 <a href="#" class="easyui-linkbutton" onclick="saveClassroomAdd()">保存</a>
			 <a href="#" class="easyui-linkbutton" onclick="javascript:$('#classroom_add').dialog({closed:true})">取消</a>
	   </div>
	   
	   <!-- 定义修改表单上的按钮 -->
   		<div id="btnsedit">
		   	 <a href="#" class="easyui-linkbutton" onclick="saveClassroomEdit()">保存</a>
			 <a href="#" class="easyui-linkbutton" onclick="javascript:$('#classroom_edit').dialog({closed:true})">取消</a>
	   </div>
	   	
	<div id="dd" ></div>
</body>  
</html>